<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<input type="button" value="Click Me" id="myBtn">
<script>
    let btn = document.getElementById('myBtn')
    btn.onclick = function (event) {
        console.log('onclick',event.type)
    }
    btn.addEventListener('click',(event) =>{
        console.log('event',event)
        console.log('addEventListener',event.type)
    })
    
    /*
        event的一些重要属性
            - preventDefault()  取消事件的默认行为,只有 cancelable 为 true 才可以调用这个方法
            - stopImmediatePropagation()  用于取消所有后续事件捕获或事件冒泡，并阻止调用任何后续事件处理程序(DOM3 Events 中新增)
            - stopPropagation()   用于取消所有后续事件捕获或事件冒泡。只有 bubbles为 true 才可以调用这个方法
            - currentTarget  指向this
            - type  触发事件的类型
     */
</script>
</body>
</html>